<template>
  <!--pages/index/component/workType/index.wxml-->
  <view class="content_box">
    <view v-for="(item, index) in workTypeValue" :key="index" class="b_item" @click="handleGodetail(item)">
      <view class="firstLine">
        <view class="workName">{{ item.positionName }}</view>
        <view class="info">
          <text>￥</text>
          <text class="num bigNum">{{ Number(item.startSalary) }}</text>
          <text class="num bigNum" v-if="item.endSalary">～{{ Number(item.endSalary) }}</text>
          <text>/{{ item.salaryPeriodLabel }}</text>
        </view>
      </view>
      <view class="secLine">
        <view class="type" v-if="item.positionType == 1">零工兼职</view>
        <view class="type" v-if="item.positionType == 2">小时工兼职</view>
        <view class="type" v-if="item.positionType == 3">全职岗位</view>
        <view class="info">
          <view v-for="z in item.labels" :key=z>{{ z }}</view>
          <view>{{ item.experienceLabel }}</view>
          <view v-if="item.calculationType == 1">日结</view>
          <view v-if="item.calculationType == 2">周结</view>
          <view v-if="item.calculationType == 3">月结</view>
          <view>{{ item.educationLabel }}</view>
        </view>
      </view>
      <view class="threeLine">
        <view class="left">
          <image src="@/static/images/recruit/icon1.png" mode="" />
          <text>{{ item.fullName }}</text>
        </view>
        <view class="right">
          {{ item.addressLabel }}
        </view>
      </view>
    </view>

  </view>
</template>
  
<script>
import { getCollectList } from "@/api/pages/mine.js"

export default {
  props: {
    workTypeValue: {
      type: Array,
      default: [],
    },
    positionType: {
      type: String,
      default: '1'
    }
  },
  components: {},
  data() {
    return {
      styleData: {
        topText: "",
        background: "#2eabee",
        TextColor: "#FFF",
      },
    };
  },
  computed: {},
  watch: {},
  async onLoad(options) { },
  async onShow() { },
  onReady() { },
  mounted() {
    this.getCollectListFun()
  },
  methods: {
    handleGodetail(item) {
      console.log(item, "item-岗位详情");
      uni.navigateTo({
        url:
          "/pages/recruit/post/postDetail/index?positionId=" + item.positionId + '&positionType=' + this.positionType,
      });
    },
    // 获取我的收藏列表
    getCollectListFun() {
      getCollectList().then((res) => {
        console.log(res);
      })
    }
  },
};
</script>
<style lang="scss" scoped>
/* pages/index/component/workType/index.wxss */
.content_box {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;

  .b_item {
    background: #fff;
    width: 700rpx;
    height: 230rpx;
    border-radius: 10px;
    margin-bottom: 10px;

    >view {
      height: 33.3%;
      display: flex;
      align-items: center;
      padding: 0 10px;

      image {
        width: 17px;
        height: 19px;
      }
    }

    .firstLine {
      display: flex;
      justify-content: space-between;

      .workName {
        font-family: PingFangSC-Medium;
        font-weight: 500;
        font-size: 32rpx;
        color: #000;
      }

      .info {
        font-size: 24rpx;

        .num {
          color: #ff9e24;
        }

        .bigNum {
          font-size: 26rpx;
        }
      }
    }

    .secLine {
      display: flex;
      align-items: center;

      .type {
        background: #34a1ff;
        border-radius: 4px;
        height: 40rpx;
        text-align: center;
        line-height: 40rpx;
        width: 120rpx;
        color: #fff;
        font-size: 22rpx;
        margin-top: 10rpx;
      }

      .info {
        display: flex;
        flex-wrap: wrap;
        margin-left: 5px;
        width: calc(100% - 110rpx);

        >view {
          background: #f5f5f5;
          border: 1px solid #cfcfcf;
          padding: 4rpx 10rpx;
          border-radius: 10rpx;
          margin: 0 6rpx;
          font-size: 20rpx;
          color: #000000a3;
          margin-top: 10rpx;
        }
      }
    }

    .threeLine {
      justify-content: space-between;

      >view {
        display: flex;
        align-items: center;
        font-size: 24rpx;

        >text {
          margin-left: 5px;
          color: #000000a3;
        }

        >view {
          color: #00000073;
        }
      }
    }
  }
}
</style>
  